<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>三安芯片掃描</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">	
    <link rel="stylesheet" href="./4/lumen/bootstrap.css" media="screen">
    <link rel="stylesheet" href="./_assets/css/custom.min.css">
  </head>
  <body>
  <div class="container">
	<form>
	  <fieldset>
		<legend>三安芯片掃描</legend>
		<div class="form-group row">
		  <label class="col-sm-2 col-form-label" for="inputDefault">工單:</label>
		  <div class="col-sm-10">
		  <input class="form-control" placeholder="W7C14H" id="wo" type="text">
		  </div>
		</div>	
		<div class="row" id="woDesc">	
		</div>
		<div class="form-group row">
		  <label class="col-sm-2 col-form-label" for="inputDefault">掃描二維碼:</label>
		  <div class="col-sm-10">
		  <input class="form-control" placeholder="17620T4003-7250613" id="qr" type="text">
		  
		  </div>
		</div>
		<div class="form-group row">
		  <label class="col-sm-2 col-form-label" for="inputDefault">數量:</label>
		  <div class="col-sm-3">
		  <input readonly=""  class="form-control"  id="qty" type="text">
		  </div>
		  <label class="col-sm-2 col-form-label" for="inputDefault">累加量:</label>
		  <div class="col-sm-3">
		  <input readonly=""  class="form-control"  id="sqty" type="text">
		  </div>
		</div>			
		<div class="row">	
			<table class="table table-hover" style="table-layout:fixed" >
			  <thead>
				<tr class="table-active">
				  <th width="10%" scope="col">芯片種類</th>
				  <th width="17%" scope="col">批號</th>
				  <th width="10%" scope="col">規格</th>
				  <th width="7%" scope="col">電壓最小值</th>
				  <th width="7%" scope="col">電壓最大值</th>
				  <th width="7%" scope="col">亮度最小值</th>
				  <th width="7%" scope="col">亮度最大值</th>
				  <th width="7%" scope="col">主波長最小值</th>
				  <th width="7%" scope="col">主波長最大值</th>
				  <th width="7%" scope="col">數量</th>
				  <th width="14%"  scope="col">二維碼</th>
				</tr>
			  </thead>
			  <tbody id="blues">
			
			  </tbody>
			</table>	
		</div>
	</form>
	<p class="lead">
    <a class="btn btn-primary btn-lg" href="index.html" role="button">返回</a>
	</p>
	
	</div>
    <script src="./_vendor/jquery/dist/jquery.min.js"></script>
    <script src="./_vendor/popper.js/dist/umd/popper.min.js"></script>
    <script src="./_vendor/bootstrap/dist/js/bootstrap.min.js"></script>
    <script src="./_assets/js/custom.js"></script>
	<script>
	var disks;
	var disksB;
	var cks=new Array(20);
		var v1=0,v2=0,h1=0,h2=0,w1=0,w2=0;
		$("#wo").keypress(function(e){ //change
		  console.log($("#wo").val());
		  $("ul").find("li").remove(); 
		  var key = e.which;
		  if (key == 13) { 
			$.ajax({ url: "getwo.php?lot="+$("#wo").val(), 
					dataType : "text",
					success: function(data){
					wos=data.split(",");
					v1=parseFloat(wos[4].split("-")[0]);
					v2=parseFloat(wos[4].split("-")[1]);
					h1=parseFloat(wos[5].split("-")[0]);
					h2=parseFloat(wos[5].split("-")[1]);
					w1=parseFloat(wos[6].split("-")[0]);
					w2=parseFloat(wos[6].split("-")[1]);
					
					$("#woDesc").text("");// 清空数据
					
					html = 
						'<table class="table table-hover">'+
						'  <thead>'+
						'	<tr class="table-active">'+
						'	  <th scope="col">工單號</th>'+
						'	  <th scope="col">成品料號</th>'+
						'	  <th scope="col">芯片料號</th>'+
						'	  <th scope="col">品名規格</th>'+
						'	  <th scope="col">電壓</th>'+
						'	  <th scope="col">亮度</th>'+
						'	  <th scope="col">波長</th>'+
						'	</tr>'+
						'  </thead>'+
						'  <tbody>'+
						'	<tr >'+
						'	  <th scope="row">'+$("#wo").val()+'</th>'+
						'	  <td>'+wos[0]+'</td>'+
						'	  <td>'+wos[1]+'</td>'+
						'	  <td>'+wos[3]+'</td>'+
						'	  <td>'+wos[4]+'</th>'+
						'	  <td>'+wos[5]+'</th>'+
						'	  <td>'+wos[6]+'</th>'+
						'	</tr>'+
						'  </tbody>'+
						'</table>';	
					$("#woDesc").append(html);	
					$("#qty").val(wos[2]);
				  }
				  });		  
			$("#qr").focus();
		 }
		});	
		//S-30MBMUD-C,17C120650VY008212,457CI155,17045,   --3
		//VF:3.02,3.07,3.10,0.02,  --4，5，6，7
		//PO:155.0,156.7,161.0,1.11, --8，9，10，11
		//WD:457.5,458.2,460.0,0.58,--12，13，14，15
		//00-00-F1-000-000-V
        var sum = 0;
		var i = 0;
		$("#qr").keypress(function(e){
		  console.log($("#qr").val());
		
		  var key = e.which;
		  if (key == 13) {
			qrs=$("#qr").val().split(",");
		    i++;
			bg="";
			vb=parseFloat(qrs[4].split(":")[1]);
			if (vb<v1) {bg1='bgcolor="red"';} else {bg1='bgcolor="green"';}  
			ve=parseFloat(qrs[6]);
			if (ve>v2) {bg2='bgcolor="red"';} else {bg2='bgcolor="green"';}  
			hb=parseFloat(qrs[8].split(":")[1]);
			if (hb<h1) {bg3='bgcolor="red"';} else {bg3='bgcolor="green"';}
			he=parseFloat(qrs[10]);
			if (he>h2) {bg4='bgcolor="red"';} else {bg4='bgcolor="green"';}
			wb=parseFloat(qrs[12].split(":")[1]);
			if (wb<w1) {bg5='bgcolor="red"';} else {bg5='bgcolor="green"';}
			we=parseFloat(qrs[14]);
			if (we>w2) {bg6='bgcolor="red"';} else {bg6='bgcolor="green"';}
			html=	'<tr ><td>'+qrs[0]+'</td> '+
					'	  <td  style="overflow:hidden;white-space:nowrap;text-overflow:ellipsis;">'+qrs[1]+'</td>'+
					'	  <td>'+qrs[2]+'</td>'+
					'	  <td '+bg1+' id="v'+i.toString()+'">'+vb+'</td>'+
					'	  <td '+bg2+' id="vv'+i.toString()+'">'+ve+'</td>'+
					'	  <td '+bg3+' id="h'+i.toString()+'">'+hb+'</td>'+
					'	  <td '+bg4+' id="hh'+i.toString()+'">'+he+'</td>'+
					'	  <td '+bg5+' id="w'+i.toString()+'">'+wb+'</td>'+
					'	  <td '+bg6+' id="ww'+i.toString()+'">'+we+'</td>'+
					'	  <td>'+qrs[3]+'</td>'+
					'	  <td  style="overflow:hidden;white-space:nowrap;text-overflow:ellipsis;" >'+$("#qr").val()+'</td>'+
					'	</tr>';
			sum +=parseFloat(qrs[3]);		
			$("#sqty").val(sum);
			$("#blues").append(html);
			$("#qr").select();
		  }
		  
		});	
	
	</script>
	
	
  </body>
</html>
